import { View, Text } from '@tarojs/components'
import { useState } from 'react'
import { Button, Card, Toast } from '@nutui/nutui-react-taro'
import Taro, { useLoad } from '@tarojs/taro'
import { userApi, orderApi, serviceApi } from '../../api/index'
import './index.less'

export default function MockTest() {
  const [result, setResult] = useState('')
  const [loading, setLoading] = useState(false)

  const testUserInfo = async () => {
    setLoading(true)
    try {
      const data = await userApi.getUserInfo()
      setResult(`用户信息获取成功:\n${JSON.stringify(data, null, 2)}`)
      Taro.showToast({ title: '获取成功', icon: 'success' })
    } catch (error) {
      setResult(`用户信息获取失败: ${error.message}`)
      Taro.showToast({ title: '获取失败', icon: 'error' })
    } finally {
      setLoading(false)
    }
  }

  const testOrderList = async () => {
    setLoading(true)
    try {
      const data = await orderApi.getOrderList()
      setResult(`订单列表获取成功:\n${JSON.stringify(data, null, 2)}`)
      Taro.showToast({ title: '获取成功', icon: 'success' })
    } catch (error) {
      setResult(`订单列表获取失败: ${error.message}`)
      Taro.showToast({ title: '获取失败', icon: 'error' })
    } finally {
      setLoading(false)
    }
  }

  const testServiceList = async () => {
    setLoading(true)
    try {
      const data = await serviceApi.getServiceList()
      setResult(`服务列表获取成功:\n${JSON.stringify(data, null, 2)}`)
      Taro.showToast({ title: '获取成功', icon: 'success' })
    } catch (error) {
      setResult(`服务列表获取失败: ${error.message}`)
      Taro.showToast({ title: '获取失败', icon: 'error' })
    } finally {
      setLoading(false)
    }
  }

  const testCreateOrder = async () => {
    setLoading(true)
    try {
      const data = await orderApi.createOrder({
        serviceType: '深度清洁',
        serviceTime: '2025-01-28 15:00',
        address: '北京市朝阳区测试地址'
      })
      setResult(`订单创建成功:\n${JSON.stringify(data, null, 2)}`)
      Taro.showToast({ title: '创建成功', icon: 'success' })
    } catch (error) {
      setResult(`订单创建失败: ${error.message}`)
      Taro.showToast({ title: '创建失败', icon: 'error' })
    } finally {
      setLoading(false)
    }
  }

  return (
    <View className='mock-test-page'>
      <Card className='header-card'>
        <Text className='title'>Mock 数据测试</Text>
        <Text className='subtitle'>测试各个 API 接口是否正常工作</Text>
      </Card>

      <Card className='test-card'>
        <View className='test-buttons'>
          <Button
            type='primary'
            size='large'
            loading={loading}
            onClick={testUserInfo}
            className='test-btn'
          >
            测试用户信息
          </Button>
          
          <Button
            type='primary'
            size='large'
            loading={loading}
            onClick={testOrderList}
            className='test-btn'
          >
            测试订单列表
          </Button>
          
          <Button
            type='primary'
            size='large'
            loading={loading}
            onClick={testServiceList}
            className='test-btn'
          >
            测试服务列表
          </Button>
          
          <Button
            type='primary'
            size='large'
            loading={loading}
            onClick={testCreateOrder}
            className='test-btn'
          >
            测试创建订单
          </Button>
        </View>
      </Card>

      {result && (
        <Card className='result-card'>
          <Text className='result-title'>测试结果:</Text>
          <View className='result-content'>
            <Text className='result-text'>{result}</Text>
          </View>
        </Card>
      )}

      <Card className='info-card'>
        <Text className='info-title'>说明:</Text>
        <View className='info-list'>
          <Text className='info-item'>• Mock 插件已成功配置</Text>
          <Text className='info-item'>• 开发环境自动使用 Mock 数据</Text>
          <Text className='info-item'>• 生产环境会请求真实 API</Text>
          <Text className='info-item'>• 支持完整的错误处理机制</Text>
        </View>
      </Card>
    </View>
  )
}